<template>
	<view class="agreements-container">
		<checkbox-group @change="change">
			<label>
				<checkbox value="1" :checked="checked" color="#559df1" style="transform:scale(0.7)" />
				<text>我已阅读并同意</text>
				<text class="text-button" @click.stop="toPage(0)">《用户服务协议》</text>
				<text class="text-button" @click.stop="toPage(1)">《用户隐私政策》</text>
				<text>中全部条款。</text>
			</label>
		</checkbox-group>
	</view>
</template>

<script>
	export default {
		props: {
			value: {
				type: Boolean,
				default: false,
			}
		},
		data() {
			return {
				checked: false,
			}
		},
		methods: {
			change(val) {
				this.$emit('input', val.detail.value.length > 0)
			},
			toPage(id) {
				uni.navigateTo({
					url: '/pages/webview/index?id=' + id,
				})
			}
		},
		created() {
			this.checked = this.value;
		}
	}
</script>

<style scoped lang="scss">
	.agreements-container {
		margin-top: 120rpx;
		text-align: left;
		font-size: 30rpx;

		.text-button {
			color: #559df1;
		}
	}
</style>